<template>
	<div class="content-wrap">
		<img
			v-if="isExpandButton && !['A','CF','L','C'].includes(parseData.questionType)"
			class="show-ico"
			:class="{open: parseData.isShowAnalysis}"
			src="../../../../assets/images/open-q-ico.png"
			alt="展开按钮"
			@click="parseData.isShowAnalysis = !parseData.isShowAnalysis"
		>
		<slot name="seq" type="parent" />
		<div class="content-box">
			<!-- 基础题题目或复合题题干 -->
			<div class="err-box" :class="parseData.errorInfoTypes" @click="clickBox">
				<!-- 选择题 -->
				<view-choice
					v-if="['S','M','I'].includes(parseData.questionType)"
					:question-type="parseData.questionType"
					:question-title="parseData.questionTitle"
					:question-option="parseData.optionList"
				/>
				<!-- 简答题 -->
				<view-short-answer
					v-else-if="parseData.questionType === 'O'"
					:question-title="parseData.questionTitle"
				/>
				<!-- 判断题 -->
				<view-judge
					v-else-if="parseData.questionType === 'J'"
					:question-title="parseData.questionTitle"
				/>
				<!-- 填空题 -->
				<view-blank
					v-else-if="parseData.questionType === 'F'"
					:question-title="parseData.questionTitle"
				/>
				<!-- 选词填空题 -->
				<view-choose-word
					v-else-if="parseData.questionType === 'BC'"
					:question-title="parseData.questionTitle"
					:question-option="parseData.optionList"
				/>
				<!-- 完型填空题 -->
				<view-cloze-test
					v-else-if="parseData.questionType === 'CF'"
					:question-title="parseData.questionTitle"
				/>
				<!-- 案例分析题 -->
				<view-case-analysis
					v-else-if="parseData.questionType === 'A'"
					:question-title="parseData.questionTitle"
				/>
				<!-- 听力题 -->
				<view-listening
					v-else-if="parseData.questionType === 'L'"
					:question-title="parseData.questionTitle"
					:listening-audio-url="parseData.listeningAudioUrl"
				/>
				<!-- 配伍题 -->
				<view-compatibility
					v-else-if="parseData.questionType === 'C'"
					:question-title="parseData.questionTitle"
					:question-option="parseData.optionList"
				/>
				<!-- 不是复合题才展示解析 -->
				<answer-analysis
					class="q-style-answer-analysis-box"
					v-if="!['A','CF','L','C'].includes(parseData.questionType) && parseData.isShowAnalysis"
					:answer="parseData.answer"
					:analysis="parseData.questionAnswerParse"
					:question-keywords="parseData.questionKeywords"
					:question-score-weight="parseData.questionScoreWeight"
					:video-list="parseData.questionVideoPathList"
					:audio-list="parseData.questionAudioPathList"
				/>
				<chapter-label-knowledge
					v-if="!['A','CF','L','C'].includes(parseData.questionType) && parseData.isShowChapter && parseData.isShowKnowledge && parseData.isShowLabel"
					:chapter-list="parseData.chapterList"
					:is-show-chapter="parseData.isShowChapter"
					:knowledge-list="parseData.knowledgeList"
					:is-show-knowledge="parseData.isShowKnowledge"
					:label-list="parseData.labelList"
					:is-show-label="parseData.isShowLabel"
					:area-list="parseData.areaList"
					:applicable-year="parseData.applicableYear"
				/>
			</div>
			<div v-if="parseData.errorInfoMsgs.length" class="err-text-box">
				<strong>错误原因：</strong>
				<div
					v-for="(err, errIndex) in parseData.errorInfoMsgs"
					:key="errIndex"
				>
					{{ errIndex + 1 }}、{{ err }}
				</div>
			</div>
			<slot name="parent-bottom" />
			<!-- 复合题型展示子题 -->
			<template v-if="['A', 'CF', 'L', 'C'].includes(parseData.questionType)">
				<div v-for="(item, index) in parseData.smallQuestionList" :key="index" class="children-box">
					<slot name="children-top" :childrenItem="data.smallQuestionList[index]" />
					<div class="content-wrap small-err-box" :class="item.errorInfoTypes">
						<img
							v-if="isExpandButton"
							class="show-ico"
							:class="{open: item.isShowAnalysis}"
							src="../../../../assets/images/open-q-ico.png"
							alt="展开按钮"
							@click="item.isShowAnalysis = !item.isShowAnalysis"
						>
						<slot name="seq" type="children" :childrenIndex="index" />
						<div class="content-box" @click="clickBox">
							<!-- 选择题 -->
							<view-choice
								v-if="['S','M','I'].includes(item.questionType)"
								:question-type="item.questionType"
								:question-title="item.questionTitle"
								:question-option="item.optionList"
							/>
							<!-- 简答题 -->
							<view-short-answer
								v-else-if="item.questionType === 'O'"
								:question-title="item.questionTitle"
							/>
							<!-- 判断题 -->
							<view-judge v-else-if="item.questionType === 'J'" :question-title="item.questionTitle" />
							<!-- 填空题 -->
							<view-blank v-else-if="item.questionType === 'F'" :question-title="item.questionTitle" />
							<!-- 选词填空题 -->
							<view-choose-word
								v-else-if="item.questionType === 'BC'"
								:question-title="item.questionTitle"
								:question-option="item.optionList"
							/>
							<answer-analysis
								class="q-style-answer-analysis-box"
								v-if="item.isShowAnalysis"
								:answer="item.answer"
								:analysis="item.questionAnswerParse"
								:question-keywords="item.questionKeywords"
								:question-score-weight="item.questionScoreWeight"
								:video-list="item.questionVideoPathList"
								:audio-list="item.questionAudioPathList"
							/>
							<chapter-label-knowledge
								v-if="item.isShowChapter && item.isShowKnowledge && item.isShowLabel"
								:chapter-list="item.chapterList"
								:is-show-chapter="item.isShowChapter"
								:knowledge-list="item.knowledgeList"
								:is-show-knowledge="item.isShowKnowledge"
								:label-list="item.labelList"
								:is-show-label="item.isShowLabel"
								:area-list="item.areaList"
								:applicable-year="item.applicableYear"
							/>
							<div v-if="item.errorInfoMsgs.length" class="err-text-box">
								<strong>错误原因：</strong>
								<div
									v-for="(err, errIndex) in item.errorInfoMsgs"
									:key="errIndex"
								>
									{{ errIndex + 1 }}、{{ err }}
								</div>
							</div>
							<slot name="children-bottom" :childrenItem="data.smallQuestionList[index]" />
						</div>
					</div>
				</div>
			</template>
		</div>
		<!-- 图片预览器 -->
		<el-image-viewer v-if="isShowViewer" :on-close="closeViewer" :url-list="[imgSrc]" />
	</div>
</template>

<script src="./index.mjs"></script>
<style lang="less" scoped src="./index.less"></style>
